<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no" />
		<link rel="stylesheet" type="text/css" href="../../css/aui.css" />
		<style>
			html,body {
				background: #fff !important;
			}
			.aui-list,
			.aui-list  ul,
			.aui-list  li
			{
				border: 0 !important; 
				background: none !important;
			}
			/*.t {
				z-index: 0;
				width: 100%;
				height: 100%;
			}*/
			.f {
				position: relative;
			/*	bottom: 0;
				left: 0;
				width: 100%;
				height: auto;
				overflow: hidden;
				background: #fff !important;
				z-index: 9;
				border-top-left-radius: 1rem;
				border-top-right-radius: 1rem;
				padding-bottom: 3rem;*/
			}
			.aui-card-list-content{
				padding: 0.35rem;
			}
			.aui-list .aui-list-item-media{
				 padding: 0;
			}
		 	.aui-card-list-content img.aui-img-round{
		
		 	}
		 	.aui-media-list .aui-list-item{
		 		padding: 0.5rem 0.75rem;
		 	}
		 	.aui-media-list .aui-list-item-inner{
		 		padding-left: 0.75rem;
		 	}
		 	.aui-list .a1{
		 		width: 1rem;
		 		color:#C3C3C3;
		 		font-size: 0.85rem;
		 		font-weight: bold;
		 		display: inline-block;
		 		width: 1rem;
		 		margin-right: 0.75rem;
		 		text-align: center;
		 	}
		 	.aui-list .a1 img{
		 		width: 100%;
		 	}
		 	.aui-list .a2{
		 		width: 1.8rem;
		 	}
		 	.aui-list .a3{
		 
		 	}
		 	.aui-list .a4{
		 		display: inline-block;
		 		width: auto;
		 		color:#999;
		 		font-size: 0.7rem;
		 	}
		</style>
	</head>
	<body>
		<div class="f">
	        <script id="sx-list" type="text/x-dot-template">  
	            {{ for(var i=0,len=it.length; i < len; i++) { }}
	                <li class="aui-list-item aui-list-item-middle">
	                    <div class="aui-media-list-item-inner">
	                    	<div class="aui-list-item-media a1">
	                    		{{? i > 3}}
	                    		<img src="../../image/zhibo/{{= i+1}}.png" />
	                    		{{??}}
	                    		{{= i+1}}
	                    		{{?}}
	                        </div>
	                        <div class="aui-list-item-media a2">
	                            <img src="../../image/touxiang.png" id="ffxiangImgCache" ffxiang-src="{{= fx_cdn + it[i].img }}?imageView2/1/w/100/h/100"  class="aui-img-round aui-list-img-sm">
	                        </div>
	                        <div class="aui-list-item-inner aui-ellipsis-1 a3">
	                        	{{= it[i].nickname }}
	                        </div>
	                        <div class="aui-list-item-media a4">
	                        	{{= it[i].money_num }} {{= _config.zhibo.liwu_title }}
	                        </div>
	                    </div>
	                </li>
				{{ } }}
			</script>
	        <div class="aui-card-list-content">
	        	<ul class="aui-list aui-media-list" id="sx-view">
	        		<div id="jiazai" style="padding-top: 20%;"><img src="../../image/loading_more.gif" /></div>
	        	</ul>
	        </div>
		</div>
	</body>
	<script type="text/javascript" src="../../script/zepto.min.js"></script>
	<script type="text/javascript" src="../../script/doT.js"></script>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/ffxiang.js"></script>
	<script type="text/javascript">
		apiready = function() {
			console.log(JSON.stringify(api.pageParam))
 			data();
		}
		function data() {
			_ajax('api/zhibo/phb/type/' + api.pageParam['type'],function(ret,err){
				if(ret){
					var evalData = doT.template($api.html($api.byId('sx-list')));
					$api.html($api.byId('sx-view'), evalData(ret));
					_imageCache();
				}else{
					_alert(JSON.stringify(err))
				}
			},api.pageParam)
		}
	</script>
</html>